<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<input type="text">
		<div name='div'></div>
		<div id="app">
			<input type="text" v-model="msg">
			<!-- <input type="text" v-model.lazy="msg"> -->
			<!-- <input type="text" v-model.trim='msg'> -->
			<h1>{{msg}}</h1>
			<span v-pre>{{msg}}</span>
			<span @click.once="click">点击</span>
		</div>
		<script src="../vue.js"></script>
		<script>
			let inp=document.querySelector('input'),
				div=document.querySelector('[name="div"]');
				
			inp.oninput=function(){
				div.innerText=inp.value;
			}
			
			let vm=new Vue({
				data(){
					return{
						msg:'',
					}
				},
				methods:{
					click(){
						console.log('123');
					},
				},
			}).$mount('#app');
		</script>
	</body>
</html>
